<!--
 * @Description  :
 * @Autor        : guoxi
 * @Date         : 2022-08-12 17:19:03
 * @LastEditors  : Please set LastEditors
 * @LastEditTime : 2022-09-06 17:03:05
 * @FilePath     : \rpms\src\views\funds\project-funds\detail\components\ExecutionTable.vue
-->
<template>
  <el-skeleton :loading="model.loading" animated>
    <TreeTable :value="model.treeTableData" :col="model.cloumns" :type="model.dataType" />
  </el-skeleton>
</template>
  
<script lang="ts" setup>
import { reactive, onMounted, ref } from "vue";
import TreeTable from "/@/components/treeTable/index.vue";
import { dataType2 } from "/@/components/treeTable/data";
//   import { postDownload } from "/@/utils/download";

import { getYearStatistics } from "/@/api/funds";
//   import { useRoute } from "vue-router";
const activeName = ref(new Date().getFullYear() + '');
const model = reactive({
  treeTableData: [],
  cloumns: [],
  dataType: dataType2,
  globalBudget: "",
  globalSpend: "",
  globalBudgetRateStr: "",
  loading: true
});

//   const route = useRoute();

const initGetData = async (year) => {
  const { code, data } = await getYearStatistics(year);
  if (code === 200 && data) {
    model.treeTableData = data.data;
    const { globalBudget, globalSpend, globalBudgetRateStr } = data;
    model.globalBudget = globalBudget;
    model.globalSpend = globalSpend;
    model.globalBudgetRateStr = globalBudgetRateStr;
  }
  model.loading = false;
};

onMounted(async () => {
  await initGetData(activeName.value);
  model.treeTableData.forEach(el => {
    (model.cloumns as any).push({
      name: el.deptName+'(万元)',
      align: "center",
      children: [],

    });
  });
});

defineExpose({
  initGetData
});

</script>
  
<style lang="scss" scoped>
.right-btn {
  float: right;
}
</style>
  